<template>
  <div class="app-container">

    <!-- 顶部查询表单 -->
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="100px">
      <el-form-item label="配货单号" prop="prepareCode">
        <el-input v-model="queryParams.prepareCode" placeholder="请输入配货单号" clearable />
      </el-form-item>
      <el-form-item label="订单编号?" prop="orderCode">
        <el-input v-model="queryParams.orderCode" placeholder="请输入订单编号" clearable />
      </el-form-item>
      <el-form-item label="平台单号?" prop="platformOrderCode">
        <el-input v-model="queryParams.platformOrderCode" placeholder="请输入平台单号" clearable />
      </el-form-item>
      <el-form-item label="会员名称" prop="clientName">
        <el-input v-model="queryParams.clientName" placeholder="请输入会员名称" clearable />
      </el-form-item>
      <el-form-item label="收货人" prop="consignee">
        <el-input v-model="queryParams.consignee" placeholder="请输入收货人" clearable />
      </el-form-item>
      <el-form-item label="平台类型？" prop="platformId">
        <el-select v-model="queryParams.platformId" placeholder="请选择平台类型" clearable>
          <el-option
                v-for="item in platformList"
                :key="item.id"
                :label="item.platformName"
                :value="item.id"
            />
        </el-select>
      </el-form-item>
      <el-form-item label="店铺名称" prop="shopId">
        <el-select v-model="queryParams.shopId" placeholder="请选择店铺名称" clearable>
          <el-option
            v-for="item in shopList"
            :key="item.userId"
            :label="item.shopName"
            :value="item.id"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="商品数量?">
        <el-input v-model="queryParams.minQty" placeholder="最小数量" style="width: 100px;" clearable />
        <span style="margin:0 4px;">至</span>
        <el-input v-model="queryParams.maxQty" placeholder="最大数量" style="width: 100px;" clearable />
      </el-form-item>
      <el-form-item label="商品编码?" prop="itemCode">
        <el-input v-model="queryParams.itemCode" placeholder="请输入商品编码" clearable />
      </el-form-item>
      <el-form-item label="规格信息?" prop="specInfo">
        <el-input v-model="queryParams.specInfo" placeholder="请输入规格信息" clearable />
      </el-form-item>
      <el-form-item label="配货单创建时间" label-width="130px">
        <el-date-picker v-model="auditTime" type="daterange" range-separator="—" start-placeholder="开始时间"
          end-placeholder="结束时间" value-format="yyyy-MM-dd" />
      </el-form-item>
      <el-form-item label="订单状态？" prop="orderStatus">
        <el-select v-model="queryParams.orderStatus" placeholder="请选择订单状态" clearable>
          <el-option
              v-for="dict in dict.type.order_progress"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
        </el-select>
      </el-form-item>
      <el-form-item label="配货状态" prop="prepareStatus">
        <el-select v-model="queryParams.prepareStatus" placeholder="请选择配货状态" clearable>
          <el-option v-for="item in dict.type.prepare_status" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </el-form-item>
      <!-- 返货单是否作废 -->
      <el-form-item label="返货单是否作废?" label-width="130px">
        <el-checkbox v-model="isCancel" />
      </el-form-item>
      <!-- 是否拦截 -->
      <el-form-item label="是否拦截?" prop="isIntercept">
        <el-checkbox v-model="intercepted" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <!-- 功能按钮 -->
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button plain icon="el-icon-document-copy" size="mini" @click="handlePartialDelivery">配货</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="success" plain icon="el-icon-edit" size="mini" @click="openManualDialog">手工配货</el-button>
      </el-col>

      <el-col :span="1.5">
        <el-dropdown @command="handleBatchCommand">
          <el-button size="mini" plain>批量操作<i class="el-icon-arrow-down el-icon--right"></i></el-button>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="warehouse">修改仓库</el-dropdown-item>
            <el-dropdown-item command="express">修改物流公司</el-dropdown-item>
            <el-dropdown-item command="stock">转为现货订单</el-dropdown-item>
            <el-dropdown-item command="antiAudit">反审核</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </el-col>

      <el-col :span="1.5">
        <el-button type="primary" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button type="warning" plain icon="el-icon-scissors" size="mini" @click="openSplitDialog">拆分</el-button>
      </el-col>

    </el-row>

     <!-- 表格信息、分页 -->
    <div class="app-container-main">
      <vxe-table 
        border 
        stripe 
        v-loading="loading" 
        ref="mainTable" 
        size="small"
        header-align="center"
        :row-config="rowConfig"
        :column-config="columnConfig"
        :data="mainTableData" 
        @checkbox-change="mainCheckboxChange" 
        @checkbox-all="mainCheckboxAll"
        @cell-click="cellClickEvent" 
      >
        <vxe-column type="checkbox" width="60" fixed="left"></vxe-column>
        <vxe-column type="seq" title="序号" width="60" fixed="left"></vxe-column>
        <vxe-column field="prepareCode" title="配货单号" width="140" fixed="left" align="center"></vxe-column>
        <vxe-column field="combSplitFlag" title="合拆标记" width="90" align="center"></vxe-column>
        <vxe-column field="orderCode" title="订单编号" width="140" align="center"></vxe-column>
        <vxe-column field="platformOrderCode" title="平台单号" width="140" align="center"></vxe-column>
        <vxe-column field="orderAmount" title="订单金额?" width="100" align="center"></vxe-column>
        <vxe-column field="orderCount" title="商品数量" width="100" align="center"></vxe-column>
        <vxe-column field="prepareCount" title="已配货数" width="100" align="center"></vxe-column>
        <vxe-column field="prepareStatus" title="配货状态" width="100" align="center"></vxe-column>
        <vxe-column field="itemInfo" title="商品信息？" width="180" align="center" show-overflow></vxe-column>
        <vxe-column field="clientName" title="会员名称" width="120" align="center"></vxe-column>
        <vxe-column field="shopName" title="店铺?" width="120" align="center"></vxe-column>
        <vxe-column field="consignee" title="收货人?" width="100" align="center"></vxe-column>
        <vxe-column field="rcvAddress" title="收货地址" width="200" align="center" show-overflow></vxe-column>
        <vxe-column field="warehouseName" title="仓库" width="120" align="center"></vxe-column>
        <vxe-column field="expressCompany" title="物流公司" width="120" align="center"></vxe-column>
        <vxe-column field="buyerRemark" title="买家留言？" width="140" align="center" show-overflow></vxe-column>
        <vxe-column field="remark" title="卖家备注" width="140" align="center" show-overflow></vxe-column>
        <vxe-column field="extraInfo" title="附加信息?" width="140" align="center" show-overflow></vxe-column>
        <vxe-column field="createTime" title="配货单创建时间" width="160" align="center"></vxe-column>
        <vxe-column field="interceptFlag" title="拦截?" width="80" align="center"></vxe-column>
      </vxe-table>

      <!-- 主表格分页 -->
      <pagination 
        v-show="total > 0" 
        :total="total" 
        :page.sync="queryParams.pageNum" 
        :limit.sync="queryParams.pageSize"
        @pagination="getList" 
      />
    </div>

    <!-- 底部Tab区域 -->
    <div class="app-container-footer">
      <el-tabs v-model="activeTab" type="border-card">
        <el-tab-pane label="商品明细" name="itemDetail">
          <ItemDetail :deliveryOrderId="currentCellId" />
        </el-tab-pane>
        <el-tab-pane label="发货信息" name="shippingInfo">
          <ShippingInfo :deliveryOrderId="currentCellId" />
        </el-tab-pane>
        <el-tab-pane label="操作日志" name="opLog">
          <OpLog :deliveryOrderId="currentCellId" />
        </el-tab-pane>
      </el-tabs>
    </div>

    <!-- 拆分弹窗 -->
    <el-dialog :visible.sync="splitDialog.visible" title="手动拆单" width="1200px" @close="closeSplitDialog">
      <vxe-table
        border
        stripe
        class="split-table"
        ref="tableRef"
        size="small"
        header-align="center"
        :data="splitDialog.data"
      >
        <vxe-column type="seq" width="70" align="center" fixed="left"></vxe-column>
        <vxe-column field="productName" show-overflow="title" align="center" title="商品名称"></vxe-column>
        <vxe-column field="productCode" show-overflow="title" align="center" title="商品编码"></vxe-column>
        <vxe-column field="specification" show-overflow="title" align="center" title="规格信息"></vxe-column>
        <vxe-column show-overflow="title" align="center" title="拆分数量" width="150"> 
          <template #default="{ row }">
            <el-input-number v-model="row.splitCount" placeholder="请输入拆分数量" :min="0" size="small" :max="row.unPrepareCount" />
          </template>
        </vxe-column>
        <vxe-column field="remark" show-overflow="title" align="center" title="商品数量"></vxe-column>
        <vxe-column field="orderCode" show-overflow="title" align="center" title="订单编号"></vxe-column>
        <vxe-column field="platformOrderCode" show-overflow="title" align="center" title="平台单号"></vxe-column>
        <vxe-column field="preSale" show-overflow="title" align="center" title="预售"></vxe-column>
        <vxe-column field="specification" show-overflow="title" align="center" title="规格信息"></vxe-column>
      </vxe-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleSplitSubmit">确 定</el-button>
        <el-button @click="closeSplitDialog">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 手工配货弹窗 -->
    <el-dialog :visible.sync="manualDialog.visible" title="手工配货" width="1200px" @close="closeManualDialog">
      <el-form label-width="100px" :inline="true"> 
        <el-form-item label="仓库名称" required>
          <el-select v-model="manualDialog.warehouseName" placeholder="请选择仓库名称" clearable>
            <el-option
              v-for="item in warehouseList"
              :key="item.warehouseCode"
              :label="item.warehouseName"
              :value="item.warehouseName"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="物流公司" required>
          <el-select v-model="manualDialog.logisticsCompany" placeholder="请选择物流公司" clearable>
            <el-option
              v-for="item in logisticsCompanyList"
              :key="item.platformName"
              :label="item.platformName"
              :value="item.platformName"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <el-tabs v-model="activeName" type="border-card">
        <el-tab-pane label="商品信息" name="products">
          <Products ref="productsComponent" :cellId="manualDialogCellId" />
        </el-tab-pane>
        <el-tab-pane label="收货地址" name="address">
          <Address :cellId="manualDialogCellId" />
        </el-tab-pane>
        <el-tab-pane label="库存信息" name="stock">
          <Stock :cellId="manualDialogCellId" />
        </el-tab-pane>
      </el-tabs>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleManualDelivery">确 定</el-button>
        <el-button @click="closeManualDialog">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 批量操作弹窗 -->
    <el-dialog :visible.sync="batchDialog.visible"
      :title="batchDialog.type === 'warehouse' ? '批量修改仓库' : batchDialog.type === 'express' ? '批量修改物流公司' : '批量转为现货订单'" width="400px"
      @close="handleBatchCancel">
      <el-form v-if="batchDialog.type === 'warehouse'" label-width="100px">
        <el-form-item label="仓库名称">
          <el-select v-model="batchForm.warehouseName" placeholder="请选择仓库名称">
            <el-option
              v-for="item in warehouseList"
              :key="item.warehouseCode"
              :label="item.warehouseName"
              :value="item.warehouseName"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <el-form v-if="batchDialog.type === 'express'" label-width="100px">
        <el-form-item label="物流公司">
          <el-select v-model="batchForm.expressCompany" placeholder="请选择物流公司">
            <el-option
              v-for="item in logisticsCompanyList"
              :key="item.platformName"
              :label="item.platformName"
              :value="item.platformName"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <div v-if="batchDialog.type === 'stock'" style="padding: 20px 0; text-align: center;">确定将选中配货单转为现货订单？</div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleBatchSubmit">确 定</el-button>
        <el-button @click="handleBatchCancel">取 消</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
import ItemDetail from './components/itemDetail.vue';
import OpLog from './components/opLog.vue';
import ShippingInfo from './components/shippingInfo.vue';

import {
  listPrepare,
  updatePrepareWarehouse,
  updatePrepareExpress,
  updatePrepareStock,
  prepare,
  manualPrepare,
  withdrewAudit,
  getPrepareItems,
  splitOrder
} from "@/api/mes/sales/prepare";
import { listPlatforms } from "@/api/mes/sales/platform";
import { listShopBasic } from "@/api/mes/sales/shopBasic";
import { listWarehouse } from "@/api/mes/wm/warehouse";
import Address from './manualDeliverComps/address.vue';
import Products from './manualDeliverComps/products.vue';
import Stock from './manualDeliverComps/stock.vue';

export default {
  name: "Prepare",
  components: {
    ItemDetail,
    OpLog,
    ShippingInfo,
    Address,
    Products,
    Stock
  },
  dicts: ['order_progress', 'prepare_status', 'platform_type'],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 总条数
      total: 0,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      // 主表格数据
      mainTableData: [],
      // 底部Tab
      activeTab: 'itemDetail',
      // 当前选中行ID
      currentCellId: null,
      manualDialogCellId: null,
      // 批量操作弹窗
      batchDialog: {
        visible: false,
        type: ''
      },
      columnConfig: {
        drag: true,
        resizable: true,
        storage: true,
        sortConfig: {
          trigger: 'cell',
          remote: true
        },
        align: 'center',
        headerAlign: 'center'
      },
      rowConfig: {
        drag: true,
        keyField: 'id',
        isHover: true,
        isCurrent: true,
      },
      batchForm: {
        warehouseName: '',
        expressCompany: ''
      },
      // 手工配货弹窗数据
      manualDialog: {
        visible: false,
        warehouseName: '',
        logisticsCompany: ''
      },
      // 拆分弹窗数据
      splitDialog: {
        visible: false,
        data: [],
      },
      platformList: [],
      shopList: [],
      warehouseList: [],
      expressList: [],
      logisticsCompanyList: [],
      isCancel: false,
      intercepted: false,
      auditTime: this.getDefaultDateRange(),
      activeName: 'products',
    };
  },
  created() {
    this.getList();
    this.getListPlatforms();
    this.getShopList();
    this.getWarehouseList();
  },
  methods: {
    // 默认最近三十天时间区间
    getDefaultDateRange() {
      const today = new Date();
      const thirtyDaysAgo = new Date();
      thirtyDaysAgo.setDate(today.getDate() - 30);
      const formatDate = (date) => {
          const year = date.getFullYear();
          const month = String(date.getMonth() + 1).padStart(2, '0');
          const day = String(date.getDate()).padStart(2, '0');
          return `${year}-${month}-${day}`;
      };
      return [formatDate(thirtyDaysAgo), formatDate(today)];
    },
    /** 查询列表 */
    getList() {
      this.loading = true;
      if (this.auditTime && this.auditTime.length > 0) {
        this.queryParams.startDate = this.auditTime[0];
        this.queryParams.endDate = this.auditTime[1];
      }
      listPrepare(this.queryParams)
        .then(response => {
          // 兼容后端返回格式，假设 response.rows 为数据数组，response.total 为总数
          this.mainTableData = response.rows || [];
          this.total = response.total || 0;
          this.loading = false;
          if (this.mainTableData.length > 0) {
            this.$refs.mainTable.setCurrentRow(this.mainTableData[0]);
            this.cellClickEvent({ row: this.mainTableData[0] });
          }
        })
        .catch(() => {
          this.loading = false;
        });
    },
    // 仓库下拉数据
    getWarehouseList(){
      listWarehouse({
        pageNum: 1,
        pageSize: 9999,
      }).then(response => {
        this.warehouseList = response.rows;
      })
    },
    // 获取物流公司
    getLogisticsCompanyList(){
      listPlatforms({
        platformType: this.dict.type.platform_type.filter(item => item.label === '物流平台')[0].value,
        enabled: 1,
        pageNum: 1,
        pageSize: 9999,
      }).then(response => {
        this.logisticsCompanyList = response.rows;
      })
    },
    // 获取店铺列表
    getShopList() {
        listShopBasic({pageNum: 1, pageSize: 9999, enabled: 1}).then(response => {
          this.shopList = response.rows;
        });
    },
    // 获取平台列表
    getListPlatforms() {
        listPlatforms({pageNum: 1, pageSize: 9999, enabled: 1}).then(response => {
          this.platformList = response.rows;
        });
      },
    // 导出方法
    handleExport() {
      // 假设有 exportPrepareList 方法
      (this.$api?.mes?.sales?.exportPrepareList || (() => this.$modal.msg('功能开发中')))({ ...this.queryParams })
    },
    // 拆分弹窗
    openSplitDialog() {
      if (!this.ids || this.ids.length !== 1) {
        this.$modal.msgError('请选择一条要拆分的数据');
        return;
      }
      getPrepareItems(this.ids[0]).then(response => {
        response.data.forEach(item => {
          item.splitCount = 0;
        });
        this.splitDialog.data = response.data;
        this.splitDialog.visible = true;
      });
    },
    closeSplitDialog() {
      this.splitDialog.visible = false;
    },
    handleSplitSubmit() {
      // if (!this.splitDialog.splitQty || isNaN(this.splitDialog.splitQty) || this.splitDialog.splitQty <= 0) {
      //   this.$modal.msgError('请输入有效的拆分数量');
      //   return;
      // }
      this.loading = true;
      splitOrder(this.splitDialog.data)
        .then(() => {
          this.$modal.msgSuccess('拆单成功');
          this.getList();
          this.closeSplitDialog();
        })
        .catch(() => {
          this.$modal.msgError('拆单失败');
        })
        .finally(() => {
          this.loading = false;
        });
      // (this.$api?.mes?.sales?.splitPrepareOrder || (() => Promise.resolve()))({
      //   prepareId: this.splitDialog.data.id,
      //   splitQty: this.splitDialog.splitQty
      // })
      //   .then(() => {
      //     this.$modal.msgSuccess('拆单成功');
      //     this.getList();
      //     this.closeSplitDialog();
      //   })
      //   .catch(() => {
      //     this.$modal.msgError('拆单失败');
      //   })
      //   .finally(() => {
      //     this.loading = false;
      //   });
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 设置按钮 */
    handleSettings() {
      this.$modal.msg("功能开发中");
    },
    /** 手工配货-确认 */
    handleManualDelivery() {
      // 验证必填项
      if (!this.manualDialog.warehouseName) {
        this.$modal.msgError('请选择仓库名称');
        return;
      }
      if (!this.manualDialog.logisticsCompany) {
        this.$modal.msgError('请选择物流公司');
        return;
      }

      // 获取Products组件中的商品数据
      const productsComponent = this.$refs.productsComponent;
      if (!productsComponent) {
        this.$modal.msgError('未找到商品信息组件');
        return;
      }

      const productList = productsComponent.getTableData();
      if (!productList || productList.length === 0) {
        this.$modal.msgError('商品列表不能为空');
        return;
      }

      // 验证商品数据
      const salePrepareProductLineList = [];
      for (let i = 0; i < productList.length; i++) {
        const item = productList[i];
        
        // // 验证unPrepareCount
        // if (!item.prepareCount || item.prepareCount < 1) {
        //   this.$modal.msgError(`第${i + 1}行商品的本次配货数不能小于1`);
        //   return;
        // }

        salePrepareProductLineList.push({
          id: item.id || '',
          orderId: item.orderId || '',
          orderProductId: item.itemId || '',
          prepareCount: item.prepareCount,
          prepareId: this.manualDialogCellId,
          unPrepareCount: item.unPrepareCount
        });
      }

      this.$confirm('确定对选中的配货单进行手工配货吗？', '提示', {
        type: 'warning'
      }).then(() => {
        this.loading = true;
        const params = {
          expressCompany: this.manualDialog.logisticsCompany,
          warehouseName: this.manualDialog.warehouseName,
          prepareId: this.manualDialogCellId,
          salePrepareProductLineList: salePrepareProductLineList
        };
        
        manualPrepare(params)
          .then(() => {
            this.$modal.msgSuccess('手工配货成功');
            this.getList();
            this.closeManualDialog();
          })
          .catch(() => {
            this.$modal.msgError('手工配货失败');
          })
          .finally(() => {
            this.loading = false;
          });
      });
    },
    handlePartialDelivery() {
      if (!this.ids || this.ids.length === 0) {
        this.$modal.msgError('请选择要配货的数据');
        return;
      }
      this.$confirm('确定对选中的配货单进行配货吗？', '提示', {
        type: 'warning'
      }).then(() => {
        this.loading = true;
        prepare({ prepareIds: this.ids })
          .then(() => {
            this.$modal.msgSuccess('配货成功');
            this.getList();
          })
          .catch(() => {
            this.$modal.msgError('配货失败');
          })
          .finally(() => {
            this.loading = false;
          });
       
      });
    },
    openManualDialog() {
      if (!this.ids || this.ids.length === 0) {
        this.$modal.msgError('请选择要手工配货的数据');
        return;
      }
      if (this.ids.length > 1) {
        this.$modal.msgError('手工配货只能选择一条数据');
        return;
      }
      this.getLogisticsCompanyList();
      this.manualDialogCellId = this.ids[0];
      this.manualDialog.visible = true;
    },
    closeManualDialog() {
      this.manualDialog = {
        visible: false,
        warehouseName: '',
        logisticsCompany: ''
      };
      this.manualDialogCellId = '';
    },
    /** 主表格 Checkbox 事件 */
    mainCheckboxChange({ records }) {
      this.ids = records.map(item => item.id);
    },
    mainCheckboxAll({ records }) {
      this.ids = records.map(item => item.id);
    },
    /** 单元格点击事件 */
    cellClickEvent({ row }) {
      if (row && row.id !== this.currentCellId) {
        this.currentCellId = row.id;
      }
    },
    handleBatchCommand(type) {
      if (this.ids.length === 0) {
        this.$modal.msgError("请选择数据");
        return;
      }
      if (type === 'antiAudit') {
        this.$confirm('确定要对选中的配货单进行反审核吗？', '提示', {
          type: 'warning'
        }).then(() => {
          this.loading = true;
          withdrewAudit({ prepareIds: this.ids, isOk: false })
            .then(() => {
              this.$modal.msgSuccess('反审核成功');
              this.getList();
            })
            .catch(() => {
              this.$modal.msgError('反审核失败');
            })
            .finally(() => {
              this.loading = false;
            });
        });
        return;
      }
      if(type === 'express'){
        this.getLogisticsCompanyList();
      }
      this.batchDialog.type = type;
      this.batchDialog.visible = true;
      // 清空表单
      this.batchForm = { warehouseName: '', expressCompany: '' };
    },

    handleBatchSubmit() {
      if (this.batchDialog.type === 'warehouse') {
        if (!this.batchForm.warehouseName) {
          this.$modal.msgError('请选择仓库');
          return;
        }
        const params = {
          warehouseName: this.batchForm.warehouseName,
          prepareIds: this.ids
        };
        this.loading = true;
        updatePrepareWarehouse(params)
          .then(() => {
            this.$modal.msgSuccess('批量修改仓库成功');
            this.batchDialog.visible = false;
            this.getList();
          })
          .catch(() => {
            this.$modal.msgError('批量修改仓库失败');
          })
          .finally(() => {
            this.loading = false;
          });
        return;
      }
      if (this.batchDialog.type === 'express') {
        if (!this.batchForm.expressCompany) {
          this.$modal.msgError('请选择物流公司');
          return;
        }
        const params = {
          expressCompany: this.batchForm.expressCompany,
          prepareIds: this.ids
        };
        this.loading = true;
        updatePrepareExpress(params)
          .then(() => {
            this.$modal.msgSuccess('批量修改物流公司成功');
            this.batchDialog.visible = false;
            this.getList();
          })
          .catch(() => {
            this.$modal.msgError('批量修改物流公司失败');
          })
          .finally(() => {
            this.loading = false;
          });
        return;
      }
      if (this.batchDialog.type === 'stock') {
        const params = {
          prepareIds: this.ids,
          inStock: true
        };
        this.loading = true;
        updatePrepareStock(params)
          .then(() => {
            this.$modal.msgSuccess('批量转为现货订单成功');
            this.batchDialog.visible = false;
            this.getList();
          })
          .catch(() => {
            this.$modal.msgError('批量转为现货订单失败');
          })
          .finally(() => {
            this.loading = false;
          });
        return;
      }
    },
    handleBatchCancel() {
      this.batchDialog.visible = false;
    },
  }
};
</script>

<style lang="scss" scoped>
  .mb8 {
    margin-bottom: 8px;
  }
  .app-container{
    &-main{
      min-height: 400px;
    }
    &-footer{
      margin-top: 20px;
      &-title{
        display: flex;
        margin-bottom: 20px;
        &-item{
          cursor: pointer;
          padding: 5px 20px;
          border-radius: 8px;
        }
        .active{
          background-color: aqua;
        }
      }
    }
  }
  .el-select{
    width: 100%;
  }
   .upload-area {
    margin: 20px 0;
    
    // 修复上传区域宽度问题
    ::v-deep .el-upload {
      width: 100%;
    }
    
    ::v-deep .el-upload-dragger {
      width: 100%;
      box-sizing: border-box;
    }
    
    // 确保提示文字与上传区域宽度一致
    ::v-deep .el-upload__tip {
      width: 100%;
      box-sizing: border-box;
      margin-top: 10px;
      text-align: left;
      display: flex;
      align-items: center;
      flex-direction: column;
      
      .el-upload__tip {
        margin-bottom: 5px;
      }
      
      span {
        display: block;
        margin-bottom: 5px;
      }
    }
  }
  .split-table{
    max-height: 650px;
    overflow-y: auto;
  }
</style>
